<template>
<div class="discount">
    <h3 class="tit">超值折扣推荐</h3>
    <ul class="goods_list" v-if= 'goodsList.length'>
        <router-link  tag='li' class="goods_item border-bottom" v-for="(good, idx) in goodsList" :key='idx' :to="'/goodsDetail/'+good.productId">
            <div class="pic" v-html='good.productImgSm'>
                <img src="../../assets/imgs/ic_mall.png" alt="" >

            </div>
            <div class="info">
                <h3 class="title">{{good.productName}}</h3>
                <p class="price">{{good.productPinkage}}</p>
                <div class="source">
                    <p>
                    {{good.productFrom}}  |<span class="time">{{good.productTime}}</span>
                    </p>
                    <div class="num">{{good.productComCount}}</div>
                </div>
            </div>
        </router-link>
    </ul>
   <van-button class="get_more" size='large' to='/disMoney'>更多优惠信息&gt;&gt; </van-button>
</div>
</template>

<script>
export default {
  name: 'Discount',
  data() {
    return {
    }
  },
  props: {
    goodsList: Array
  },
  created() {},
  methods: {
  }
}
</script>
<style  lang='stylus' >
.discount
    background-color #fff
    margin .2rem 0
    .tit
        height .4rem
        background-color #ff614f
        padding .2rem
        color #fff
        font .30rem/.4rem "微软雅黑"
.goods_list
    margin-bottom .1rem
.goods_item
    display flex
    padding .2rem
    .pic
        flex 0 0 25%
        padding .1rem
        margin .2rem
        img
            width  100%
            object-fit contain
    .info
        flex 1
        .title
            color #000
            font-size .28rem
            margin-bottom .2rem
        .price
            color #ff6215
            line-height .6rem
            margin-bottom .4rem
            font-size .4rem
        .source
            display flex
            justify-content space-between
            color #888
            .time
                color #000
</style>
